import React, { Component } from 'react'
import Header from "../components/all/header";
import Footer from "../components/all/footer";

import {SLogin} from "../styled/login"
import { apilink } from '../api/apilink';

import { message, Button, Space ,Alert } from 'antd';
export default class regist extends Component {
    constructor(props){
        super(props)
        this.state={
            username:"",
            userpassword:"",
            cfuserpassword:""
        }
    }
    //获取输入框的内容
    shuruInfo(userInfo,e){
        this.setState({
            [userInfo]:e.target.value
        },()=>{
            console.log(this.state.cfuserpassword)
        })
    }
    //点击修改密码 发请求
    updataPassword(){
        if(this.state.username&& this.state.userpassword && this.state.cfuserpassword){
            if(this.state.userpassword === this.state.cfuserpassword){
                let usp = new URLSearchParams();
                usp.append("username",this.state.username);
                usp.append("password",this.state.userpassword)
                apilink("/api/updata_password","post",usp).then((ok)=>{
                    console.log(ok)
                    if(ok.data === "updata_success"){
                        message.success('修改密码成功');
                        this.props.history.push("/login")
                    }
                    if(ok.data === "updata_null"){
                        message.error('用户名不存在,请检查后再试');
                    }
                }).catch((err)=>{
                    console.log(err)
                })
            }else{
                message.error('两次密码输入不一致');
            }
        }else{
            message.warning('不能为空，请输入');
        }
    }
    //点击跳转到登录页面    
    // jumpRouter(){
    //     this.props.history.push("/login")
    // }
    render() {
        return (
            <div>
                <Header></Header>
                    {/* 登录 */}
                    <SLogin>
                    <div className="user">
                        <div className='title'>
                            <h1>修改密码</h1>
                            <h2>请在此修改密码，已便管理您的个人资料</h2>
                        </div>
                        <div className="user_info">
                            <label htmlFor="">
                                <p>用户名<span>*</span></p>
                                <input type="text" className="username" onInput={this.shuruInfo.bind(this,"username")}/><br/>
                            </label>
                            <label htmlFor="">
                                <p>密码<span>*</span></p>
                                <input type="password" className="password" onInput={this.shuruInfo.bind(this,"userpassword")}/>
                            </label>
                            <label htmlFor="">
                                <p>重复密码<span>*</span></p>
                                <input type="password" className="password" onInput={this.shuruInfo.bind(this,"cfuserpassword")}/>
                            </label>
                            <br/>
                            <div className="btn_login">
                            <button onClick={this.updataPassword.bind(this)}>修改密码</button>
                            </div>
                            {/* <p className="go_regist">已经是YAGE 的用户? <span onClick={this.jumpRouter.bind(this)}>点击在此登录</span></p> */}
                        </div>
                    </div>
                    </SLogin>
                <Footer></Footer>
            </div>
        )
    }
}
